除了親和性的配色外，訊息的傳遞也是很重要的，與平面設計不同的是訊息並非只有圖文的傳遞，還包含了狀態、互動、提示等等訊息，訊息也同時可以用許多不同色彩表示，增加訊息所能表示的情感、急迫性、引導性等等。

連結色彩（包含不同狀態）

網頁設計中的 <a> 除了本身的預設樣式外，另外還包含以下幾種 “狀態”

• a:link - 未拜訪過的連結。
• a:visited - 已拜訪過的連結。
• a:hover - 滑鼠回入的連結。
• a:active - 按下狀態的連結。
• a:focus - 鍵盤專注的狀態。

a:link - 未拜訪過的連結及 a:visited 已拜訪過的連結，這兩種並非在所有網站都有這樣的需求，通常會運用在「需要紀錄已讀取」的網頁上，像是搜尋引擎就是很好的例子（但現在很多都改用 JavaScript 來設計）。

設計：可視專案需求來決定是否加入這個樣式。

a:hover - 滑鼠回入的連結，這個樣式普遍都會製作，主要讓用戶滑鼠滑入時了解「這是一個可互動的按鈕」，如果少了這個樣式用戶可能會誤以為沒有連結。但要特別注意，這個樣是在行動版無法正確的呈現（因為手機沒有滑鼠 hover 的事件）。

設計：在文本中的設計中大多會使用略深的主色或次要色，然後加上下底線作為呈現。

如果以按鈕呈現，也會使用略深為按鈕原色的設計

a:active - 按下狀態的連結，這是滑鼠按下的樣式，通常會與 .active 一起製作，而 .active 可以透過後端或 JavaScript 直接套用在按鈕之上，表示目前啟用中的按鍵。

設計：通常會使用略深於普通狀態的色彩，設計時可以與 .active（啟用樣式）一起設計（文本有時不會設計，或同 hover 樣式）。

a:focus - 鍵盤專注的狀態，許多用戶會使用鍵盤搭配 tab 來瀏覽網頁（也有一部分是屬於視覺障礙者），這個專注狀態可以讓用戶了解目前「專注」的按鈕，如果用戶需要按下此按鈕，則可以按下 Enter 鍵。

設計：文本中會使用瀏覽器預設的外框，主要是因為文本中不一定能調整高度，視覺上可能會干擾到其他文字的閱讀，因此不一定會另外設計。

按鈕會在原本按鈕外增加一圈類似色彩，如果沒有另外設計則會套用瀏覽器預設的樣式。

瀏覽器預設的 focus，每個瀏覽器略有不同（下圖為 Chrome 的樣式），預設樣式不會隨著網站設計改變，大多會使用藍色外框，因此會建議自行設計。

部分網頁設計師由於沒有程式開發的經驗，所以會忽略許多行為上的樣式狀態，除了 link, visited 外，其餘都是設計時必備的項目，一開始就必須加入喔。

結語

按鈕互動對於使用者回饋相當重要，如果缺乏足夠回饋，用戶時常會以為該連結是否無法運作。而設計師為了追求畫面上的完美，有時會疏忽掉用戶操作的回饋，執行上則會建議一開始預先定義相關元素的互動狀態、錯誤行為等等，避免後續開發上的疏忽。